import { useTranslation } from 'react-i18next';
import { useNavigate } from 'react-router-dom';
import Button from 'src/component/Button';
import Modal from 'src/component/Modal';
import { Page } from 'src/constant/Page';
import style from './RedirectModal.module.scss';

type Props = {
    open: boolean;
    onClose: () => void;
};

const RedirectModal = ({ open, onClose }: Props) => {
    const { t } = useTranslation();
    const navigate = useNavigate();

    return (
        <Modal open={open} handleClose={onClose}>
            <div>
                <div>请先启用二步骤验证，才能进行提领</div>
                <div className={style.buttons}>
                    <Button appearance="secondary" onClick={onClose} type="button">
                        取消
                    </Button>
                    <Button type="button" onClick={() => navigate(Page.EnableTfa)}>
                        前往
                    </Button>
                </div>
            </div>
        </Modal>
    );
};

export default RedirectModal;
